<template>
    <div class="hearderNav">
        <div>
            <van-icon @click="show=true" name="service-o" />
            <van-popup v-model="show" position="bottom" :style="{ height: '30%' }">
                记得打给我
            </van-popup>
        </div>
        <div>
            <p>{{$route.meta.hearderNav}}</p>
        </div>
        <div>
            <van-icon name="search" @click="$router.push('/search')" />
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            show: false,
        };
    },
};
</script>

<style lang="scss" scoped>
.hearderNav {
    display: flex;
    background-color: aliceblue;
    font-size: 0.2rem;
    line-height: 0.44rem;
    justify-content: space-between;
    padding: 0 0.18rem;
    height: 0.44rem;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    div {
        .van-icon {
            font-size: 0.3rem;
        }
    }
}
</style>